<!DOCTYPE html>
<html lang="zh">

	<head>
		<meta charset="UTF-8" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<meta http-equiv="X-UA-Compatible" content="ie=edge" />
		<title>志愿者服务信息网</title>
		<link rel="shortcut icon" type="image/x-icon" href="https://yst-pjyc-server.oss-cn-beijing.aliyuncs.com/datas/image/20181120/20181120103218126806518.jpg" media="screen" />
		<link rel="stylesheet" type="text/css" href="css/reset.css" />
		<link rel="stylesheet" type="text/css" href="css/layer.css"/>
		<link rel="stylesheet" type="text/css" href="css/page.css"/>
		<link rel="stylesheet" type="text/css" href="css/volunteer_usercenter.css" />
	</head>

	<body>
		<!--top头部标题栏-->
		<div id="top">
			<div class="top_show1">
				<p id="top_t">
					<span id="login">亲，请登录</span><span id="loginOut">退出</span>&nbsp;&nbsp;&nbsp;&nbsp;<span id="registe_volunteer">志愿者注册</span>/<span id="registe_team">志愿团体注册</span>
				</p>
			</div>
			<div class="top_show2">
				<div class="top_m">
					<div class="logo">
						<img src="img/logo.jpg" />
						<div class="volunteer">
							<p>
								<a class="top_tittle" href="#">天津市滨海新区志愿者服务信息网</a>
							</p>
							<p>
								<a class="top_address" href="#">www.tjbhzyz.com</a>
							</p>
						</div>

					</div>
					<div class="search">
						<p class="sousuo_type" data-id="1">活动</p>
						<div class="search_type">
							<p data-id="1">活动</p>
							<p data-id="2">团队</p>
						</div>
						<input type="text" name="info" id="info" value="" placeholder="请输入搜索内容" />
						<p id="search"><img src="img/sercher.png" /></p>
					</div>
					<div id="help">
						<p><img src="img/icon_qzzx.png" /></p>
						<p>求助中心</p>
					</div>
					<div id="phone_vl">
						<p><img src="img/icon_qzzx.png" /></p>
						<p>志愿者平台手机版</p>
					</div>
				</div>
			</div>

			<!--导航栏-->
			<div class="top_show3">
				<div id="nav">
					<p id="vl_home">网站首页</p>
					<p id="vl_active">志愿活动</p>
					<p id="vl_team">志愿团队</p>
					<p id="vl_integral">积分兑换</p>
					<p id="vl_center" class="click">志愿中心</p>
				</div>
			</div>		
		</div>
		<div id="main">
			<div id="m_left">
				<p class="p1">用户中心</p>
				<div class="left_type">
					<p class="choose" id="v_home">我的首页</p>
					<p id="v_info">修改资料</p>
					<p id="v_password">修改密码</p>
					<p id="v_team">我的团队</p>
					<p id="v_active">我的活动</p>
					<p id="v_news">站内消息</p>
					<p id="v_guanxi">关系转换</p>
				</div>
			</div>
			<div id="m_right">
				<!--我的首页-->
				<div id="v_home_xq">
					<div class="home_top">
						<div id="home_top">
							<div class="user_img">
								<img src="img/QQ.png"/>
							</div>
							<dl class="user_dl">
								<dt><span class="name">张三</span>欢迎您回来!</dt>
								<dd>志愿者编号:<span class="user_num">dadasdad</span></dd>
								<dd>注册日期:<span class="user_creattime">dadasdad</span></dd>
								<dd>最近登录日期:<span class="user_logintime">dadasdad</span></dd>
							</dl>
						</div>
						<div class="user_info">
							<p>手机号:<span class="user_phone">1231516156151</span></p>
							<p>用户名:<span class="user_name">1231516156151</span></p>
							<p>电子邮箱:<span class="user_mail">1231516156151</span></p>
							<p>详细地址:<span class="user_address">1231516阿达啊啊大大阿萨斯多阿打算打打死阿萨德as156151</span></p>
						</div>
					</div>
					<div class="home_m">
						<table>
							<tr>
								<th>服务时间</th>
								<th>星级志愿者</th>
								<th>加入志愿团队</th>
								<th>积分</th>
								<th>服务次数</th>
							</tr>
							<tr>
								<td>0个小时</td>
								<td>暂无星级</td>
								<td>0个</td>
								<td>0个</td>
								<td>0次</td>
							</tr>
						</table>
					</div>
				</div>
				<div id="v_change">
					<p class="tittle">修改资料</p>
					<div class="v_change">
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">用户名:</span>
							</span>
							<input type="text" name="v_username" id="v_username" value="" placeholder="用户名" /><span class="tishi">dsfsdfsfssd</span>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">邮箱:</span>
							</span>
							<input type="emaila" name="v_mail" id="v_mail" value="" placeholder="邮箱" />
							<span class="tishi">dsfsdfsfssd</span>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">手机号码:</span>
							</span>
							<input type="text" name="v_phone" id="v_phone" value="" placeholder="手机号码" maxlength="11" />
							<span class="tishi"></span>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">详细地址:</span>
							</span>
							<input type="text" name="v_address" id="v_address" value="" placeholder="详细地址" />
							<span class="tishi"></span>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">最高学历:</span>
							</span>
							<select id="school_type" name="school_type ">
								<option value="请选择">请选择</option>
								<option value="研究生及以上">研究生及以上</option>
								<option value="本科">本科</option>
								<option value="大专">大专</option>
								<option value="高中">高中</option>
								<option value="初中及以下">初中及以下</option>
							</select>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">从业状况:</span>
							</span>
							<select id="job_type" name="job_type ">
								<option value="请选择">请选择</option>
								<option value="国家公务员">国家公务员</option>
								<option value="专业技术人员">专业技术人员</option>
								<option value="职员">职员</option>
								<option value="企业管理人员">企业管理人员</option>
								<option value="工人">工人</option>
								<option value="农民">农民</option>
								<option value="学生">学生</option>
								<option value="教师">教师</option>
								<option value="现役军人">现役军人</option>
								<option value="自由职业者">自由职业者</option>
								<option value="个体经营者">个体经营者</option>
								<option value="无业人员">无业人员</option>
								<option value="退(离)休人员">退(离)休人员</option>
								<option value="其他">其他</option>
							</select>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">服务区域:</span>
							</span>
							<select id="address_type" name="address_type ">
							</select>
						</p>
						<div class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">服务类别:</span>
							</span>
							<p class="right" id="v_server_type">
								<span><input type="checkbox" name="" id="lx1" data-id="1" value="社区服务" />
								<label for="lx1">社区服务</label>
								</span>
								<span><input type="checkbox" name="" id="lx2" data-id="2" value="赛会服务" />
								<label for="lx2">赛会服务</label>
								</span>
								<span><input type="checkbox" name="" id="lx3" data-id="3" value="关爱服务" />
								<label for="lx3">关爱服务</label>
								</span>
								<span><input type="checkbox" name="" id="lx4" data-id="4" value="文化教育" />
								<label for="lx4">文化教育</label>
								</span>
								<span><input type="checkbox" name="" id="lx5" data-id="5" value="在线服务" />
								<label for="lx5">在线服务</label>
								</span>
							</p>
							<span class="tishi"></span>
						</div>
						<div class="filePhoto uploadImg" id="logoUrl">
							<div class="fileBox">
								<p><img src="img/qqzone.png" class="add-img" id="vl_img"></p>
								<p id="upimg">上传图片<input type="file" name="file" id="vl_up" class="fileImg" value="" accept="image/jpg,image/jpeg,image/png,image/bmp" multiple/></p>
								<p class="">宽300像素×高300像素，大小不超过200k</p>
							</div>
						</div>

						<p class="r_p1"><span class="line"></span>服务领域或行业</p>
						<p class="right" id="server_job">
							<span><input type="checkbox" name="" id="sever1" data-id="1" value="扶贫济困志愿者" />
								<label for="sever1">扶贫济困志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever2" data-id="2" value="社区志愿者" />
								<label for="sever2">社区志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever3" data-id="3" value="青年志愿者" />
								<label for="sever3">青年志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever4" data-id="4" value="文明志愿者" />
								<label for="sever4">文明志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever5" data-id="5" value="文化志愿者" />
								<label for="sever5">文化志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever6" data-id="6" value="医疗志愿者" />
								<label for="sever6">医疗志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever7" data-id="7" value="教育志愿者" />
								<label for="sever7">教育志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever8" data-id="8" value="助残志愿者" />
								<label for="sever8">助残志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever9" data-id="9" value="巾帼志愿者" />
								<label for="sever9">巾帼志愿者</label>
								</span>
							<span><input type="checkbox" name="" id="sever10" data-id="10" value="红十字志愿者" />
								<label for="sever10">红十字志愿者</label>
								</span>
						</p>

						<p id="keep_info">保存修改</p>
					</div>
				</div>
				<div id="v_changps">
					<p class="tittle"><span class="line"></span>修改密码</p>
					<div class="v_changps">
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">原密码:</span>
							</span>
							<input type="password" name="v_passward" id="v_passward" value="" placeholder="" />
							<span class="tishi">dsfsdfsfssd</span>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">新密码:</span>
							</span>
							<input type="password" name="v_passward1" id="v_passward1" value="" placeholder="" />
							<span class="tishi">dsfsdfsfssd</span>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red">*</span>
							<span class="info">确认密码:</span>
							</span>
							<input type="password" name="v_passward2" id="v_passward2" value="" placeholder="" />
							<span class="tishi">dsfsdfsfssd</span>
						</p>
						<p class="userinfo">
							<span class="left">
							<span class="red"></span>
							<span class="info"></span>
							</span>
							<input type="button" name="v_passward2" id="ch_password" value="确认修改" placeholder="" />
						</p>
					</div>

				</div>
				<div id="v_mineteam">
					<p class="tittle"><span class="line"></span>我的团队</p>
					<div class="v_mineteam">
						<table id="v_mianteam1">
							<thead>
								<tr>
									<th width="30%">团队名称</th>
									<th width="20%">联系方式</th>
									<th width="20%">加入时间</th>
									<th width="15%">状态</th>
									<th width="15%">操作</th>
								</tr>
							</thead>
							<tbody class="my_team">
								<tr>
									<td>啦啦啦啦志愿者服务团队</td>
									<td>13388888888</td>
									<td>2018-10-26</td>
									<td>正常</td>
									<td><span>退出</span></td>
								</tr>
							</tbody>
							
							
						</table>
						<!--<table id="v_mianteam2">
							<tr>
								<th width="25%">服务时间</th>
								<th width="25%">服务次数</th>
								<th width="25%">团队服务时间排名</th>
								<th width="25%">团队服务次数排名</th>
							</tr>
							<tr>
								<td>0.5个小时</td>
								<td>1次</td>
								<td>2018-10-26</td>
								<td>正常</td>
							</tr>
						</table>						-->
					</div>
				</div>
				<div id="v_mineactive">
					<p class="tittle">基本信息</p>
					<div class="v_mineactive">
						<table>
							<thead>
							<tr>
								<th width="20%">活动名称</th>
								<th width="20%">联系方式</th>
								<th width="20%">活动时间</th>
								<th width="20%">服务时常</th>
								<!--<th width="10%">积分</th>-->
								<th width="10%">状态</th>
								<th width="10%">操作</th>
							</tr>
							</thead>
							<tbody class="my_active">
							<tr>
								<td>吃鸡小队关爱老人活动</td>
								<td>13345678956</td>
								<td>2018-10-29</td>
								<td>2小时</td>
								<!--<td>3</td>-->
								<td>已结束</td>
								<td>申请时长</td>
							</tr>
							</tbody>
						</table>
					</div>
				</div>
				<div id="v_minenews">
					<p class="tittle">站内信息</p>
					<div class="v_minenews">
						<table>
							<thead>
								<tr>
									<th width="25%">标题</th>
									<th width="30%">内容</th>
									<th width="15%">发件人</th>
									<th width="15%">发送时间</th>
									<th width="15%">操作</th>
								</tr>
							</thead>
							<tbody class="msg_info">
								<tr>
									<td>吃鸡小队关爱阿萨德阿萨德as阿萨德as老人活动</td>
									<td>阿萨德撒打算嗷嗷的哦哦大数据都我哦年纪哦偶记爱囧欧尼家具都将偶记欧尼</td>
									<td>系统推送</td>
									<td>2018-10-23 14:30</td>
									<td><span class="watch">查看</span>&nbsp;&nbsp;<span class="delete">删除</span></td>
								</tr>
							</tbody>
						</table>
					</div>
					<div class="v_page"></div>
				</div>
				<div id="v_relation">
					<p class="tittle"><span class="line"></span>关系转换</p>
					<div id="relation_xq">
						<p class="re_p1"><span>要转入的志愿者团队名称:</span><input type="text" name="toTname" id="toTname" value="" placeholder="请输入名称" /></p>
						<p class="re_p2"><span>转换原因描述:</span><textarea id="toTeamdetail" name="" rows="" cols="" placeholder="请输入内容" ></textarea></p>
					</div>
					<p id="btnToteam">提交</p>
				</div>
			</div>
		</div>
		<div class="mengban">
			<div class="sign">
				<p class="p4">温馨提示 <span class="close_s">×</span></p>
				<div class="tips">
					报名成功，请等待录用
				</div>
				<p class="btn_close">我知道了</p>
			</div>
		</div>
		<div class="mengban1">
			<div class="sign1">
				<p class="p4">申请时长 <span class="close_s1">×</span></p>
				<div class="time_length">
					<p><span>输入活动编号:</span><input type="text" name="" id="active_num" value="" /></p>
					<p><span>活动名称:</span><span id="active_name">sdadasdadadadadadadasd</span></p>
					<p class="t_p3 yidian"><span>申请时长:</span><span class="yi_time">2小时</span><span>(审核中)</span></p>
					<p><span>申请时长:</span><input type="number" name="" id="hours" value="" /><span>小时</span></p>
					<p><span>备注:</span><input type="text" name="" id="msg" value="" /></p>
					<p class="example">如:2018-12-10上午8:00和平社区关爱老人活动</p>
				</div>
				<p class="time_close">提交</p>
			</div>
		</div>
		<div class="mengban2">
			<div class="sign1">
				<p class="p4"><span class="close_s2">×</span></p>
				<div class="m_info">
					<p class="m_title">和平社区关爱老人活动</p>
					<p class="m_detail">ask吗安达没到俺怕怕恐怕看卡破考考帕克帕克帕克泡泡卡破卡破恐怕看灯泡可怕可怕可怕卡频道卡贫困泡泡卡破卡帕克帕克扑克牌卡破恐怕看帕克帕克到款皮卡帕克帕克帕</p>
				</div>
				<div class="m_bottom">
					<p class="m_join">我要报名</p>
					<p class="m_close">我知道了</p>
				</div>
				
			</div>
		</div>
		<div class="bottom">
			<div id="bottom_nav">
				<p id="link_us">联系我们</p>
				<p id="about_us">关于我们</p>
				<p id="set_home">设为首页</p>
			</div>
			<p class="bottom_p">备案号:津246541561561655天津滨海新区志愿服务网</p>
		</div>
		<!--</div>-->

	</body>
	<script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/layer.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.10&key=544e65a7e9e11d0b0a4f4bb04b06e8c8"></script>
	<script src="js/imgUp.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/page.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/common.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/volunteer_usercenter.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		/* 高德地图start */
		var windowsArr = [];
		var marker = [];
		var longitude, latitude, addressName;
		var map = new AMap.Map("mapContainer", {
			resizeEnable: true,
			center: [116.397428, 39.90923], //地图中心点
			zoom: 13, //地图显示的缩放级别
			keyboardEnable: false
		});
		AMap.plugin(['AMap.Autocomplete', 'AMap.PlaceSearch'], function() {
			var autoOptions = {
				city: "天津", //城市，默认全国
				input: "v_address" //使用联想输入的input的id
			};
			autocomplete = new AMap.Autocomplete(autoOptions);
			var placeSearch = new AMap.PlaceSearch({
				city: '天津',
				map: map
			})
			AMap.event.addListener(autocomplete, "select", function(e) {
				var location = e.poi.location;
				console.log(location)
				longitude = location.lng;
				latitude = location.lat;
				addressName = e.poi.name;
				console.log(longitude + "-----" + latitude+'------'+addressName)
				//TODO 针对选中的poi实现自己的功能
				placeSearch.setCity(e.poi.adcode);
				placeSearch.search(e.poi.name)

				/* 选择定位后，更新省市区的显示 */
				console.log(e)
				var district = e.poi.district;
			});
		});
		//上传图片
		var vlImg;
		$(".fileBox").on('click','#vl_up',function(){
			console.log(111111)
			$("#vl_up").takungaeImgup({
				formData: {
					'filesname': 'imageFile'
				},
				url: 'http://172.16.5.66:17001/webadmin/fileupload/image',
				maxImage: 1,
				success: function(data) {
					console.log(data)
				},
				error: function(err) {
					console.log(err)
				}
			});
		})
	</script>

</html>